<?php echo $this->render('/public/header'); ?>
<style>
    .jing-product {
        max-height: 100px;
        overflow: hidden;
    }

    .jing-product:hover {
        height: auto;
        max-height: none;
        overflow: auto;
    }
</style>
<script src="https://cdn.bootcss.com/element-ui/2.3.4/index.js"></script>
<link href="https://cdn.bootcss.com/element-ui/2.3.4/theme-chalk/index.css" rel="stylesheet">
<div class="col-xs-12" id="main">
    <a href="/sell/getquote" class="btn btn-success">添加报价</a>
    <br/>
    <br/>
    <div class="col-lg-6 col-md-6 col-xs-6 col-sm-6">
        <form class="form-inline" method="get">
            <div class="form-group">
                <input type="text" value="<?php echo yii::$app->request->get('quote_id'); ?>" name="quote_id"
                       class="form-control" placeholder="搜索报价编号"/>
            </div>

            <div class="form-group">
                <input type="text" value="<?php echo yii::$app->request->get('customer_name'); ?>" name="customer_name"
                       class="form-control" placeholder="搜素客户名称"/>
            </div>

            <div class="form-group">
                <input type="text" value="<?php echo yii::$app->request->get('product'); ?>" name="product"
                       class="form-control" placeholder="搜索产品"/>
            </div>

            <div class="form-group">
                <button class="btn btn-success">搜素</button>
            </div>
        </form>
    </div>
    <div class="col-lg-3 col-lg-offset-3 col-md-offset-3 col-md-3 col-xs-3 col-sm-3 col-xs-offset-3 col-sm-offset-3">
        <p><b>注意事项：</b></p>
        <p><b>一个客户的同几个产品（可能对数量，价格，或增加减少产品项目），都在同一个报价里面修改。</b></p>
        <p><b>一个客户先后对不同的产品进行报价，可以做在不同的报价单里。</b></p>
        <p><b>尽量在整个列表里面可以清楚看见自己对不同客户不同产品的历史报价</b></p>
    </div>
    <div class="col-lg-12 col-sm-12 col-md-12 col-xs-12">
        <?php if ($this->params['list']): ?>
            <?php foreach ($this->params['list'] as $v): ?>
                <div class="panel panel-<?php echo ['success', 'primary', 'danger', 'info'][rand(0, 3)]; ?>">
                    <div class="panel-heading"><?php echo $v['date']; ?><?php echo $v['name']; ?></div>
                    <div class="panel-body">
                        <?php $product = json_decode($v['product_list'], true); ?>
                        <div class="col-lg-1 col-sm-2 col-md-2 col-xs-2"><img style="width:100px;height:100px"
                                                                              src="<?php echo isset($product[0]['img_src'][0]) ? $product[0]['img_src'][0] : '/statics/img/logo2.png'; ?>"/>
                        </div>
                        <div class="col-lg-1 col-sm-1 col-md-1 col-xs-1"><?php echo $v['quote_id']; ?></div>
                        <div class="col-lg-1 col-sm-2 col-md-2 col-xs-2"><?php $customer = json_decode($v['customer_info'], true);
                            echo $customer['buyer']; ?></div>
                        <div class="col-lg-1 col-sm-2 col-md-2 col-xs-2"><?php echo $v['number']; ?></div>
                        <div class="col-lg-1 col-sm-2 col-md-2 col-xs-2">
                            <?php
                            foreach ($product as $v2):
                                echo $v2['item'] . "<br/>";
                            endforeach;
                            ?>
                        </div>
                        <div class="btn-group">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"
                                    aria-haspopup="true" aria-expanded="false">
                                查看历史版本<span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu" style="margin-left:25px">
                                <?php foreach ($this->params['oldlist'][$v['quote_id']] as $k2 => $v2) { ?>
                                    <li>
                                        <a href="/sell/quote_edit?id=<?php echo $v2['id']; ?>"><?php echo date('m-d H:i', $v2['create_at']); ?></a>
                                    </li>
                                <?php } ?>
                            </ul>
                        </div>
                        <a href="/sell/quote_edit?id=<?php echo $v['id']; ?>"
                           class="layui-btn layui-btn-normal layui-btn-small">编辑</a>
                        <?php if (!in_array($v['id'], $this->params['pi_list'])) { ?>
                            <a href="/sell/pi?id=<?php echo $v['id']; ?>"
                               class="layui-btn layui-btn-warm layui-btn-small">添加pi</a>
                        <?php } ?>
                        <a href="/sell/download_quote?id=<?php echo $v['id']; ?>&type=1"
                           class="layui-btn layui-btn-danger layui-btn-small">下载excel</a>
                        <el-button type="primary" size="small"
                                   @click="generateOrder('<?php echo $v['quote_id']; ?>','<?php echo $customer['buyer']; ?>','<?php echo $v['number']; ?>')">
                            生成paypal订单
                        </el-button>
                    </div>
                </div>
            <?php endforeach; ?>
        <?php endif; ?>
    </div>

    <div id="page" style="display:inline-block;"></div>
    <span>共<?php echo $this->params['total_size']; ?>条记录</span>

    <el-dialog title="创建样品订单" :visible.sync="visible">
        <el-form ref="form" :model="form">
            <el-form-item label="客户名称">
                <el-input v-model="form.customer_name" placeholder="审批人"></el-input>
            </el-form-item>
            <el-form-item label="客户编号" required>
                <el-input v-model="form.number" placeholder="没有客户编号无法生成订单"></el-input>
            </el-form-item>
            <el-form-item label="订单名称" required>
                <el-input v-model="form.name"></el-input>
            </el-form-item>
            <el-row :gutter="20">
                <el-col :span="5">
                    产品名称
                </el-col>
                <el-col :span="5">
                    数量
                </el-col>
                <el-col :span="5">
                    单价
                </el-col>
                <el-col :span="5">
                    类型
                </el-col>
                <el-col :span="4">
                    删除
                </el-col>
            </el-row>

            <el-row :gutter="20" v-for="(v,k) in form.item" style="margin-top: 10px">
                <el-col :span="5">
                    <el-input v-model="v.item" placeholder=""></el-input>
                </el-col>
                <el-col :span="5">
                    <el-input v-model="v.num" type="number"></el-input>
                </el-col>
                <el-col :span="5">
                    <el-input v-model="v.price" type="number"></el-input>
                </el-col>
                <el-col :span="5">
                    <el-select v-model="v.type">
                        <el-option key=1 value=1 label="样品费"></el-option>
                        <el-option key=2 value=2 label="快递费"></el-option>
                        <el-option key=3 value=3 label="其他"></el-option>
                        <el-option key=4 value=4 label="大货"></el-option>
                    </el-select>
                </el-col>
                <el-col :span="4">
                    <el-button @click="del(k)">删除</el-button>
                </el-col>
            </el-row>
            <el-button @click="addmore()" type="danger" style="margin-top: 10px">添加产品</el-button>
            <el-form-item label="订单备注">
                <el-input autosize type="textarea" v-model="form.remark" placeholder=""></el-input>
            </el-form-item>
            <el-form-item label="订单金额" required>
                <el-input type="number" v-model="form.total_money"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submit()">生成订单</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
</div>
<script>
    new Vue({
        el: "#main",
        data: {
            visible: false,
            form: {
                name: '',
                remark: '',
                number: '',
                customer_name: '',
                quote_id: '',
                item: [
                    {
                        item: '',
                        num: 1,
                        price: 0,
                        type: "1"
                    }
                ]
            }
        },
        watch: {
            form: {
                handler() {
                    let a = 0;
                    console.log(typeof this.form.item);
                    if (typeof this.form.item == 'object') {
                        this.form.item.forEach(v => {
                            a += v.price * v.num;
                        });
                        this.form.total_money = a.toFixed(2);
                    }

                },
                deep: true,
            }
        },
        methods: {
            del(k) {
                let arr = [];
                this.form.item.forEach((v, k2) => {
                    if (k != k2) {
                        arr.push(v);
                    }
                });
                this.form.item = arr;
            },
            addmore() {
                const data = {
                    item: '',
                    price: 0,
                    num: 1,
                    type: "1"
                };
                this.form.item.push(data);
                console.log(this.form.item);
            },
            submit() {
                if (!this.form.total_money || !this.form.number) {
                    this.$message.error('信息未填完整');
                    return false;
                }
                const that = this;
                this.$confirm('确认生成订单')
                    .then(() => {
                        let data = this.form;
                        data.items = JSON.stringify(data.item);
                        $.post('/api/order/generate-sample-order', data, function (res) {
                            if (res.code == 1) {
                                that.$message({
                                    type: 'success',
                                    message: '生成成功'
                                });
                                that.visible = false;
                            } else {
                                that.$message.error('生成失败,请重试');
                            }
                        }, 'json');
                        console.log(this.form);
                    });

            },
            generateOrder(quote_id, name, number) {
                this.form.total_money = '';
                this.form.name = '';
                this.form.remark = '';
                this.form.item = [{
                    item: '',
                    price: 0,
                    num: 1,
                    type: "1"
                }];
                this.visible = true;
                this.form.number = number;
                this.form.customer_name = name;
                this.form.quote_id = quote_id;
            }
        }

    });
    layui.laypage({
        cont: "page",
        curr:<?php echo $this->params['page']['curr'];?>,
        pages:<?php echo $this->params['page']['page'];?>,
        skin: "#5FB878",
        skip: true,
        jump: function (obj, first) {
            if (!first) {
                if (window.location.search) {
                    window.location.href = "<?php echo $this->params['page']['url'];?>" + "&p=" + obj.curr;
                }
                else {
                    window.location.href = "<?php echo $this->params['page']['url'];?>" + "?p=" + obj.curr;
                }
            }
        }
    });

</script>
<?php echo $this->render('/public/footer'); ?>
